import React from 'react';
import { observer } from 'mobx-react-lite';
import ReactEcharts from 'echarts-for-react';

export const InstitutionDistribution = observer(() => {
  const option = {
    xAxis: {
      type: 'category',
      data: ['nvestor', 'financial institution', 'Advisory organization'],
    },
    yAxis: {
      type: 'value',
    },
    series: [{
      data: [210, 370, 290],
      type: 'bar',
      itemStyle: {
        normal: {
          color(params: any) {
            const colorList = ['#4181FF', '#FFBC41', '#30D54A'];
            return colorList[params.dataIndex];
          },
        },
      },
      barWidth: '50%',
    }],
  };


  return (
    <ReactEcharts option={option}/>
  );
});
